<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8">
		<title>360安全浏览器</title>
		<link rel="stylesheet" href="css/index.css">
		<link rel="stylesheet" href="css/common.css">
		<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/Swiper/4.0.2/css/swiper.css">
	</head>
	<body>
		<div class="header">
			<div class="menus">
				<h1>360安全浏览器</h1>
				<a class="link" href="" target="_blank">应用</a>
				<a class="link" href="" target="_blank">帮助</a>
				<a class="link" href="" target="_blank">论坛</a>
				<a class="link" href="" target="_blank">国产版</a>
				<a class="link" href="" target="_blank">企业版</a>
				<a class="link" href="" target="_blank">猎网平台</a>
				<a class="link" href="" target="_blank">Mac版</a>
				<a class="link" href="" target="_blank">手机版</a>
				<a class="link" href="" target="_blank">Bata版下载</a>
			</div>
		</div>
		<!-- banner start -->
		<div class="banner">
			<div class="benner-content titlesTransformDefault">
				<p class="banner-title">从这里出发，看到更多</p>
				<a href="" class="banner-btn-download">立即体验</a>
				<p class="banner-tips">360安全浏览器&nbsp;&nbsp;&nbsp;&nbsp;<span>|</span>&nbsp;&nbsp;&nbsp;&nbsp;正式版:12.2.1564.0</p>
				<img src="/common/images/banner_home.png">
			</div>
		</div>
		<!-- banner end -->

		<!-- mini program start-->
		<div class="miniprogram titlesTransformDefault">
			<p class="miniprogram-title">小程序，新连接，全场景</p>
			<p class="miniprogram-desc">融合内容、服务、工具、视频、资讯等丰富小程序，全新 PC 使用体验，精彩世界，快速触达</p>
			<div class="minigrogram-tools">
				<img src="/common/images/banner_home.png">
				<img class="pop_img show_pop_img" src="common/images/program_01.jpg">
				<img class="pop_img" src="common/images/program_02.jpg">
				<img class="pop_img" src="common/images/program_03.jpg">
				<img class="pop_img" src="common/images/program_04.jpg">
			</div>
			<div class="minigrogram-tabs">
				<div class="tab-item tab-active">
					<div class="icon icon-01"></div>
					<span class="desc">追剧</span>
				</div>
				<div class="tab-item">
					<div class="icon icon-02"></div>
					<span class="desc">资讯</span>
				</div>
				<div class="tab-item">
					<div class="icon icon-03"></div>
					<span class="desc">工具</span>
				</div>
				<div class="tab-item">
					<div class="icon icon-04"></div>
					<span class="desc">游戏</span>
				</div>
			</div>
		</div>
		<!-- mini program end-->

		<!-- chrome start -->
		<div class="chrome">
			<div class="chrome-content">
				<p class="content-title titlesTransformDefault">内核全面升级，带来极致体验</p>
				<div class="chrome-tabs titlesTransformDefault">
					<div class="item">
						<img src="common/images/chrome_core.png" alt="">
						<p>内核性能更强</p>
					</div>
					<div class="item">
						<img src="common/images/chrome_frist.png" alt="">
						<p>浏览速度更快</p>
					</div>
					<div class="item">
						<img src="common/images/chrome_mm.png" alt="">
						<p>占能存更低</p>
					</div>
				</div>
			</div>
		</div>
		<!-- chrome end -->

		<!-- platform start -->
		<div class="platform">
			<div class="platform-left">
				<p class="platform-title titlesTransformDefault">全平台覆盖<br>跨平台数据共享</p>
				<p class="platform-desc titlesTransformDefault">账号登录，所有设置一键同步，喜欢的功能无需重复设置；<br>云端同步，数据永不丢失</p>
				<div class="platform-tabs titlesTransformDefault">
					<div class="item">
						<img src="/common/images/platform-windows.png" alt="">
						<span>Windows</span>
					</div>
					<div class="item">
						<img src="/common/images/platform-mac.png" alt="">
						<span>Mac</span>
					</div>
					<div class="item">
						<img src="/common/images/platform-china.png" alt="">
						<span>国产系统</span>
					</div>
					<div class="item">
						<img src="/common/images/platform-mobile.png" alt="">
						<span>移动设备</span>
					</div>
				</div>
			</div>
			<div class="platform-right titlesTransformDefault">
				<img src="common/images/platform_img.png" alt="">
			</div>
		</div>
		<!-- platform end -->

		<!-- skinbpx start -->
		<div class="skinbox">
			<div class="skinbox-content titlesTransformDefault">
				<p class="skinbox-title">颜值时代，浏览器皮肤也不能输</p>
				<p class="skinbox-desc">耳目一新的设计，高清精美的壁纸，让你上网时更添一份好心情</p>

				<div class="swiper-container ">
					<div class="swiper-wrapper">
						<div class="swiper-slide">
							<img class="item" src="common/images/skin_01.png" alt="">
						</div>
						<div class="swiper-slide">
							<img class="item" src="common/images/skin_02.png" alt="">
						</div>
						<div class="swiper-slide">
							<img class="item" src="common/images/skin_03.png" alt="">
						</div>
						<div class="swiper-slide">
							<img class="item" src="common/images/skin_04.png" alt="">
						</div>
						<div class="swiper-slide">
							<img class="item" src="common/images/skin_05.png" alt="">
						</div>
						<div class="swiper-slide">
							<img class="item" src="common/images/skin_06.png" alt="">
						</div>
					</div>
					<!-- 如果需要分页器 -->
					<div class="swiper-pagination"></div>

					<!-- 如果需要导航按钮 -->
					<div class="swiper-button-prev"></div>
					<div class="swiper-button-next"></div>

					<!-- 如果需要滚动条 -->
					<div class="swiper-scrollbar"></div>
				</div>
				<div class="custom-pagination"></div>
			</div>
		</div>
		<!-- skinbox end -->

		<!-- safebox start -->
		<div class="safebox">
			<div class="safebox-content">
				<p class="safebox-title titlesTransformDefault">15大安全防护，安全领航</p>
				<div class="safebox-tips titlesTransformDefault">
					<div class="item">
						<p>照妖镜网址鉴定</p>
						<p class="num safeWebsiteNum"><span>1000</span>万</p>
					</div>
					<div class="item">
						<p>拦截网站攻击</p>
						<p class="num safeAttackNum"><span>1000</span>万</p>
					</div>
					<div class="item">
						<p>下载检测木马</p>
						<p class="num safeMumaNum"><span>1000</span>万</p>
					</div>
				</div>
			</div>
		</div>
		<!-- safebox end -->


	</body>
	<script src="https://cdn.bootcdn.net/ajax/libs/jquery/1.10.0/jquery.js"></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/Swiper/4.0.2/js/swiper.js"></script>
	<script src="/js/index.js"></script>
</html>
